<template>
	<div>
		<form @submit.prevent="nextStep">
			<div class="carEditorSubmit" @click="submit" style="z-index: 10;">
				<button class="button button-icon" slot="right" type="submit" style="color: #fff; z-index: 0;">下一步</button>
			</div>
			<div class="page has-navbar has-tabbar" v-nav="{title: '编辑车辆', showBackButton: true}">
				<div class="page-content padding-top reserve-margin">

					<div class="car-editor">

						<div class="reserve">
							<list>
								<!--必填 增加on-->
								<item>
									<div class="car-enitor-tr" @click="regionNameFn" >
										<div class="car-editor-name">车场区域</div>
										<div class="car-editor-input"><input type="text" v-model="routerParams.region.regionName" readonly /><input type="text" name="regionId" v-model="routerParams.regionId" class="none" /></div>
										<div class="car-editor-right"><i class="ion-ios-arrow-right"></i></div>
									</div>
								</item>
								<item v-if="!userSession.shopId">
									<div class="car-enitor-tr active" @click="shopNameFn">
										<div class="car-editor-name">商铺列表</div>
										<div class="car-editor-input"><input type="text" v-model="routerParams.shop.shopName" readonly /><input type="text" name="shopId" v-model="routerParams.shopId" class="none" /></div>
										<div class="car-editor-right"><i class="ion-ios-arrow-right"></i></div>
									</div>
								</item>
								<input type="text" v-else name="shopId" v-model="userSession.shopId" class="none" />
								<item :class="{noedit: routerParams.carStockState >= 10}">
									<div class="car-enitor-tr active">
										<div class="car-editor-name">车驾号</div>
										<div class="car-editor-input"><input type="text" v-model="carVin" name="carVin" placeholder="请填写17位字母数字组成的编码" pattern="^([0-9A-Z]){17}$" required  onkeyup="this.value=this.value.replace(/\W/g,'')" onafterpaste="this.value=this.value.replace(/\W/g,'')" maxlength = 17  /></div>
										<div class="car-editor-right"><i @click="fileClick" class="ion-android-camera" style="font-size: 32px; color: #FF6816;"></i></div>
									</div>
									<input type="file" ref="fileImg" @change="fileFn" accept="image/*" class="none" />
								</item>
								<item :class="{noedit: routerParams.carStockState >= 10}">
									<div class="car-enitor-tr on active" @click="brandNameFn">
										<div class="car-editor-name">品牌车系</div>
										<div class="car-editor-input">
											<input type="text" :value="routerParams.brand.brandName+' '+routerParams.series.seriesName" readonly required />
											<input type="text" name="brandId" v-model="routerParams.brandId" class="none" />
											<input type="text" name="modelId" v-model="routerParams.modelId" class="none" />
											<input type="text" name="seriesId" v-model="routerParams.seriesId" class="none" />
										</div>
										<div class="car-editor-right"><i class="ion-ios-arrow-right"></i></div>
									</div>
								</item>
								<item>
									<div class="car-enitor-tr on active">
										<div class="car-editor-name">宣传标题</div>
										<div class="car-editor-input"><input type="text" name="carTitle" v-model="routerParams.carTitle" required /></div>
										<div class="car-editor-right"></div>
									</div>
								</item>
								
								<item :class="{noedit: routerParams.carStockState >= 10}">
									<div class="car-enitor-tr on active">
										<div class="car-editor-name">行驶里程</div>
										<div class="car-editor-input"><input type="number" step="0.0001" min="0.0001"  required max="99.9999" @change="limite" v-model="routerParams.carMileage" placeholder="请输入行驶里程" name="carMileage" /></div>
										<div class="car-editor-right">万公里</div>
									</div>
								</item>
								<item>
									<div class="car-enitor-tr on" @click="carLicenceStatusFn">
										<div class="car-editor-name">是否已上牌</div>
										<div class="car-editor-input">{{routerParams.carLicenceState | filterCarLicenceStatus}}<input type="text" v-model="routerParams.carLicenceState" name="carLicenceState" class="none" /></div>
										<div class="car-editor-right"><i class="ion-ios-arrow-right"></i></div>
									</div>
								</item>
								<item :class="{noedit: routerParams.carStockState >= 10}" v-if="routerParams.carLicenceState==1">
									<div class="car-enitor-tr on active">
										<div class="car-editor-name">首次上牌年月</div>
										<div class="car-editor-input"><input v-once type="month" ref="carLicenceDate" v-model="carLicenceDate" required class="month-one" />
                      <input type="text" name="carLicenceDate"  :value="routerParams.carLicenceDate | filterDateForMonthTwo" readonly class="month-two" >
                    </div>
										<div class="car-editor-right"></div>
									</div>
								</item>
								<!--<item v-if="routerParams.carLicenceState==1">
									<div class="car-enitor-tr on">
										<div class="car-editor-name">出厂年月</div>
										<div class="car-editor-input"><input v-once type="month" :value="routerParams.carFacotryDate | filterDateForMonthTwo" name="carFacotryDate" /></div>
										<div class="car-editor-right"></div>
									</div>
								</item>-->
								<item :class="{noedit: routerParams.carStockState >= 10}" v-if="routerParams.carLicenceState==1">
									<div class="car-enitor-tr on">
										<div class="car-editor-name">年审日期</div>
										<div class="car-editor-input"><input v-once type="month" class="month-one" v-model="carValidateDate" name="carValidateDate" />
                      <input type="text" :value="routerParams.carValidateDate | filterDateForMonthTwo" readonly class="month-two" >
                    </div>
										<div class="car-editor-right"></div>
									</div>
								</item>
								<item>
									<div class="car-enitor-tr on">
										<div class="car-editor-name">商业险到期</div>
										<div class="car-editor-right">
											<div class="item item-borderless item-toggle von-toggle">
												<label class="toggle toggle-balanced">
										            <input type="checkbox" v-model="carBusinessInsuranceDateTrue">
										            <div class="track">
										            	<div class="handle"></div>
										            </div>
										        </label>
											</div>
										</div>
										<!--<input type="text" v-model="" />-->
									</div>
								</item>
								<item v-if="routerParams.carLicenceState==1&&!carBusinessInsuranceDateTrue">
									<div class="car-enitor-tr on">
										<div class="car-editor-name">商业险日期</div>
										<div class="car-editor-input"><input v-once class="month-one" type="month" name="carBusinessInsuranceDate" v-model="carBusinessInsuranceDate" />
                      <input type="text" :value="routerParams.carBusinessInsuranceDate | filterDateForMonthTwo" readonly class="month-two" >
                    </div>
										<div class="car-editor-right"></div>
									</div>
								</item>
								<item v-if="routerParams.carLicenceState==1">
									<div class="car-enitor-tr on">
										<div class="car-editor-name">交强险日期</div>
										<div class="car-editor-input"><input v-once type="month" class="month-one" name="carForceInsuranceDate" v-model="carForceInsuranceDate" />
                      <input type="text" :value="routerParams.carForceInsuranceDate | filterDateForMonthTwo" readonly class="month-two" >
                    </div>
										<div class="car-editor-right"></div>
									</div>
								</item>
								<!--<item v-if="routerParams.carLicenceState==1">
									<div class="car-enitor-tr on">
										<div class="car-editor-name">车船税日期</div>
										<div class="car-editor-input"><input v-once type="month" name="carVehicletaxDate" :value="routerParams.carVehicletaxDate | filterDateForMonthTwo" /></div>
										<div class="car-editor-right"></div>
									</div>
								</item>-->
								<item>
									<div class="car-enitor-tr on" @click="carKeyNumFn">
										<div class="car-editor-name">钥匙数量</div>
										<div class="car-editor-input"><input type="text" name="carKeyNum" v-model="routerParams.carKeyNum" readonly placeholder="请选择钥匙数量" /></div>
										<div class="car-editor-right"><i class="ion-ios-arrow-right"></i></div>
									</div>
								</item>
								<item :class="{noedit: routerParams.carStockState >= 10}">
									<div class="car-enitor-tr on active" @click="carOutColorFn">
										<div class="car-editor-name">外观颜色</div>
										<div class="car-editor-input"><input type="text" v-model="routerParams.carOutColor" readonly required placeholder="请选择颜色" required /><input type="text" name="carOutColor" v-model="routerParams.carOutColor" class="none" /></div>
										<div class="car-editor-right"><i class="ion-ios-arrow-right"></i></div>
									</div>
								</item>
								<item>
									<div class="car-enitor-tr on" @click="carInColorFn">
										<div class="car-editor-name">内饰颜色</div>
										<div class="car-editor-input"><input type="text" v-model="routerParams.carInColor" readonly required placeholder="请选择颜色" /><input type="text" name="carInColor" v-model="routerParams.carInColor" class="none" /></div>
										<div class="car-editor-right"><i class="ion-ios-arrow-right"></i></div>
									</div>
								</item>
								<item>
									<div class="car-enitor-tr on" @click="carTypeNameFn">
										<div class="car-editor-name">车身类型</div>
										<div class="car-editor-input"><input type="text" class="y-item-input" name="" v-model="routerParams.carType.carTypeName" placeholder="请选择车身类型" readonly><input type="text" name="carTypeId" v-model="routerParams.carTypeId" class="none" /></div>
										<div class="car-editor-right"><i class="ion-ios-arrow-right"></i></div>
									</div>
								</item>
								<item>
									<div class="car-enitor-tr on" @click="carGearboxFn">
										<div class="car-editor-name">变速箱</div>
										<div class="car-editor-input"><input type="text" readonly v-model="routerParams.carGearbox" name="carGearbox" placeholder="请输入变速箱" /></div>
										<div class="car-editor-right"></div>
									</div>
								</item>
								<!-- <item>
									<div class="car-enitor-tr on">
										<div class="car-editor-name">车门数量</div>
										<div class="car-editor-input"><input type="number" v-model="routerParams.carDoorNum" name="carDoorNum" placeholder="请输入车门数量" min="1" max="10" /></div>
										<div class="car-editor-right">个</div>
									</div>
								</item> -->
								<item>
									<div class="car-enitor-tr on">
										<div class="car-editor-name active">过户次数</div>
										<div class="car-editor-input"><input type="number" v-model="routerParams.carTransferNum" name="carTransferNum" placeholder="请输入过户次数" min="1" max="99" /></div>
										<div class="car-editor-right">次</div>
									</div>
								</item>
								<item>
									<div class="car-enitor-tr on">
										<div class="car-editor-name">排量</div>
										<div class="car-editor-input"><input type="number" v-focus-to-top step="0.1" min="0.1" max="99.9" name="carDisplacement" v-model="turbineNum" placeholder="请输入排量" /></div>
										<div class="car-editor-right">
											{{turbine}}
											<!-- <input type="text" class="none"  v-model="turbineChange" /> -->
										</div>
										<!--<input type="text" v-model="" />-->
									</div>
								</item>
								<item>
									<div class="car-enitor-tr on">
										<div class="car-editor-name">涡轮增压</div>
										<div class="car-editor-right">
											<div class="item item-borderless item-toggle von-toggle">
												<label class="toggle toggle-balanced">
											            <input type="checkbox" v-model="turbineIs">

											            <div class="track">
											            	<div class="handle"></div>
											            </div>
											        </label>
											</div>
										</div>
										<input type="hidden" name="carInletModel" :value="turbineIs?'T':'L'">
									</div>
								</item>
								<!-- <item>
									<div class="car-enitor-tr on">
										<div class="car-editor-name">新车指导价</div>
										<div class="car-editor-input"><input type="number" step="0.01" v-model="routerParams.carGuidePrice" name="carGuidePrice" placeholder="请输入新车指导价"  /></div>
										<div class="car-editor-right">万元</div>
									</div>
								</item> -->
								<item>
									<div class="car-enitor-tr on">
										<div class="car-editor-name">延保服务</div>
										<div class="car-editor-right">
											<div class="item item-borderless item-toggle von-toggle">
												<label class="toggle toggle-balanced">
										            <input type="checkbox" v-model="carExtendedWarranty">
										            <div class="track">
										            	<div class="handle"></div>
										            </div>
										        </label>
											</div>
										</div>
										<input type="hidden" name="carExtendedWarranty" :value="carExtendedWarranty?1:0">
										<!--<input type="text" v-model="" />-->
									</div>
								</item>
								<item>
									<div class="car-enitor-tr on">
										<div class="car-editor-name">金融服务</div>
										<div class="car-editor-right">
											<div class="item item-borderless item-toggle von-toggle">
												<label class="toggle toggle-balanced">
										            <input type="checkbox" v-model="carFinanceService">
										            <div class="track">
										            	<div class="handle"></div>
										            </div>
										        </label>
											</div>
										</div>
										<input type="hidden" name="carFinanceService" :value="carFinanceService?1:0">
										<!--<input type="text" v-model="" />-->
									</div>
								</item>
                <item :class="{noedit: routerParams.carStockState >= 10}">
									<div class="car-enitor-tr on" @click="carPurposeFn">
										<div class="car-editor-name">车辆用途</div>
										<div class="car-editor-input"><input type="text" readonly :value="routerParams.carPurpose | filterCarPurpose" placeholder="请选择车辆用途" required="required" /></div>
										<input type="hidden" name="carPurpose" v-model="routerParams.carPurpose" />
										<div class="car-editor-right"></div>
									</div>
								</item>
								<item v-if="routerParams.shopId">
									<div class="car-enitor-tr on" @click="saleDealUserIdFn">
										<div class="car-editor-name">销售员工</div>
										<div class="car-editor-input"><input type="text" readonly v-model="routerParams.user.userName" placeholder="请选择销售员工" /></div>
										<input type="hidden" name="saleUserId" v-model="routerParams.saleUserId" />
										<div class="car-editor-right"></div>

									</div>
								</item>
								<item>
									<div class="car-enitor-tr on">
										<div class="car-editor-name">是否面议</div>
										<div class="car-editor-right">
											<div class="item item-borderless item-toggle von-toggle">
												<label class="toggle toggle-balanced">
										            <input type="checkbox" v-model="negoIs">
										            <div class="track">
										            	<div class="handle"></div>
										            </div>
										        </label>
											</div>
										</div>
										<!--<input type="text" v-model="" />-->
									</div>
								</item>
                <div v-if="!negoIs">
                  <!-- <item @click.native="carRetailAboutFn" v-if="routerParams.carLicenceState == 1" >
                    <div class="car-enitor-tr">
                      <div class="car-editor-name">建议零售价：</div>
                      <div class="car-editor-input"><input type="text" v-model="routerParams.carRetailAbout" readonly placeholder="点击获取估值" ></div>
                      <input type="hidden" name="carValuationJson" v-model="routerParams.carValuationJson">
                    </div>
                  </item> -->
                  <item>
                    <div class="car-enitor-tr active">
                      <div class="car-editor-name">零售价</div>
                      <div class="car-editor-input"><input type="number" required step="0.01" min="0.01" max="99.99" v-model="routerParams.carRetailPrice" name="carRetailPrice" placeholder="请输入零售价" v-focus-to-top /></div>
                      <div class="car-editor-right">万元</div>
                    </div>
                  </item>
                </div>
								<input v-else type="text" name="carRetailPrice" class="none" value="0" />
								<!-- <item>
									<div class="car-enitor-tr on">
										<div class="car-editor-name">销售底价</div>
										<div class="car-editor-input"><input type="number" step="0.01" v-model="routerParams.carFloorPrice" name="carFloorPrice" placeholder="请输入销售底价"  /></div>
										<div class="car-editor-right">万元</div>
									</div>
								</item> -->
								<!-- <item>
									<div class="car-enitor-tr on">
										<div class="car-editor-name">完税价</div>
										<div class="car-editor-input"><input type="number" step="0.01" v-model="routerParams.carTaxPrice" name="carTaxPrice" placeholder="请输入完税价"  /></div>
										<div class="car-editor-right">万元</div>
									</div>
								</item> -->
								<!-- <item>
									<div class="car-enitor-tr on active">
										<div class="car-editor-name">展厅价</div>
										<div class="car-editor-input"><input type="number" step="0.01" required v-model="routerParams.carShowPrice" name="carShowPrice" placeholder="请输入展厅价"  /></div>
										<div class="car-editor-right">万元</div>
									</div>
								</item> -->
								<!-- <item>
									<div class="car-enitor-tr on">
										<div class="car-editor-name">网络价</div>
										<div class="car-editor-input"><input type="number" step="0.01" v-model="routerParams.carNetworkPrice" name="carNetworkPrice" placeholder="请输入网络价" /></div>
										<div class="car-editor-right">万元</div>
									</div>
								</item>
								<item>
									<div class="car-enitor-tr on">
										<div class="car-editor-name">黄色预警库龄</div>
										<div class="car-editor-input"><input type="number" v-model="routerParams.carYellowAge" name="carYellowAge" placeholder="请输入黄色预警库龄" /></div>
										<div class="car-editor-right">天</div>
									</div>
								</item>
								<item>
									<div class="car-enitor-tr on">
										<div class="car-editor-name">红色预警库龄</div>
										<div class="car-editor-input"><input type="number" v-model="routerParams.carRedAge" name="carRedAge" placeholder="请输入红色预警库龄" /></div>
										<div class="car-editor-right">天</div>
									</div>
								</item> -->
								<item>
									<div class="car-enitor-tr on">
										<div class="car-editor-name">补充说明</div>
										<div class="car-editor-input"><input type="text" v-focus-to-top v-model="routerParams.carTaxPrice" name="carTaxPrice" placeholder="请输入补充说明" /></div>
										<div class="car-editor-right"></div>
									</div>
								</item>
							</list>
							<input type="number" name="carId" v-model="routerParams.carId" style="display: none;" />

						</div>

					</div>

				</div>
			</div>
		</form>
		<transition name="bottom" v-for="(item,index) in paramsIs">
			<keep-alive>
				<modal :paramsIs="paramsIs" :itemIndex="index" />
			</keep-alive>
		</transition>
		<transition name="bottom">
			<keep-alive>
				<brand :paramsIs="paramsIs" v-if="paramsBrand" @brandDelete="brandDelete" @brandComplete="brandComplete" />
			</keep-alive>
		</transition>
    
	</div>
</template>

<script>
import modal from "src/assembly/modalList";
import brand from "src/assembly/brand";
import brandModal from "../add/brand.vue";
import gearboxModal from "../add/gearbox.vue";
import reject from 'src/assembly/reject.vue'
import { bus } from "bus.js";
export default {
  data() {
    return {
      carBusinessInsuranceDateTrue: true,
      paramsData: {},
      getJson: {
        params: {},
        getParams: {
          saleDealUserId: {
            name: "",
            id: ""
          }
        }
      },
      paramsIs: [],
      paramsBrand: false,
      turbine: "L",
      turbineIs: false,
      negoIs: false,
      carFinanceService: false,
      carExtendedWarranty: false,
      turbineNum: "",
      carVin: "",
      routerParams: {
        brand: {},
        series: {},
        carType: {},
        region: {},
        shop: {},
        carImages: [],
        user: {}
      },
      backfill: {},
      carConfIds: []
    };
  },
  components: {
    modal,
    brand,
    reject
  },
  mounted: function() {
    this.busOn();
    this.getData();
    $modal
      .fromComponent(brandModal, {
        title: "选择品牌",
        theme: "assertive",
        onHide: () => {
          // console.log();
        }
      })
      .then(modal => {
        this.brandModal = modal;
      });
    $modal
      .fromComponent(gearboxModal, {
        title: "变速箱",
        theme: "assertive",
        onHide: () => {
          // console.log();
        }
      })
      .then(modal => {
        this.gearboxModal = modal;
      });

    bus.$on("gearbox", text => {
      this.routerParams.carGearbox = text;
      this.gearboxModal.hide();
    });

    bus.$on("brandId", text => {
      this.routerParams.brandId = text;
    });

    bus.$on("brandName", text => {
      this.routerParams.brand.brandName = text;
    });

    bus.$on("seriesId", text => {
      this.routerParams.seriesId = text;
    });

    bus.$on("seriesName", text => {
      this.routerParams.series.seriesName = text;
    });

    bus.$on("modelId", text => {
      this.routerParams.modelId = text;
      this.brandModal.hide();
    });

    bus.$on("modelName", text => {
      this.routerParams.carTitle =
        this.routerParams.brand.brandName +
        this.routerParams.series.seriesName +
        this.routerParams.model.modelName;
    });
    bus.$off("saleDealUserId");
    bus.$on("saleDealUserId", index => {
      this.routerParams.user.userName = this.paramsIs[0].list[index].name;
      this.routerParams.saleUserId = this.paramsIs[0].list[index].id;
      this.paramsIs = [];
    });
    
  },
  computed: {
    userSession() {
      return sess.get("userSession");
    },
    turbineChange() {
      return parseFloat(this.turbineNum).toFixed(1) + this.turbine;
    },
    carLicenceDate: {
      get () {
        return this.handleDate('yyyy-MM', this.routerParams.carLicenceDate)
      },
      set (value) {
        this.routerParams.carLicenceDate = value
      }
    },
    carValidateDate : {
      get () {
        return this.handleDate('yyyy-MM', this.routerParams.carValidateDate)
      },
      set (value) {
        this.routerParams.carValidateDate =  value
      }
    },
    carBusinessInsuranceDate : {
      get () {
        return this.handleDate('yyyy-MM', this.routerParams.carBusinessInsuranceDate)
      },
      set (value) {
        this.routerParams.carBusinessInsuranceDate = value
      }
    },
    carForceInsuranceDate : {
      get () {
        return this.handleDate('yyyy-MM', this.routerParams.carForceInsuranceDate)
      },
      set (value) {
        this.routerParams.carForceInsuranceDate = value
      }
    }
  },
  methods: {
    // 时间过滤器
    handleDate (format, value) {
      var _type = format
      var _date = new Date(value || '')
      return _type
        .replace(/(y{4})/, _date.getFullYear())
        .replace(/(M{2})/, function(){ return _date.getMonth() < 9 ? '0' + (_date.getMonth() + 1) : (_date.getMonth() + 1)})
    },
    // 查询估值
    carRetailAboutFn () {
      if (!this.routerParams.modelId && !this.routerParams.carMileage && !this.routerParams.carLicenceDate){
        window.$toast.show('请输入车型、里程、上牌时间')
        return false
      }
      window.axios.get(baseUrl + '/controller/che300/getChe300CarPrice', {params: {
        mile: this.carMileage,
        modelId: this.modelId,
        zone: '101010',
        regDate: this.carLicenceDate
      }}).then(res => {
        let resu = res.data.result
        if (resu[0].status == 1) {
          this.carRetailAbout = `${resu.filter(item => item.valuationCondition == 'normal')[0].valuationDealerLowSoldPrice} 万 ~ ${resu.filter(item => item.valuationCondition == 'excellent')[0].valuationDealerHighSoldPrice} 万`
          
        } else {
          setTimeout(() => {
            window.$toast.show('未找到相关数据')
          }, 400)
          
        }
        this.carValuationJson = JSON.stringify(resu)
        
      })
    },
    carGearboxFn() {
      this.gearboxModal.show();
    },
    // 行驶里程修改小数点
    limite (value) {
      console.log('1111111111', value);

    },
    //员工选择
    saleDealUserIdFn() {
      window.axios
        .get(baseUrl + "/controller/getUserList", {
          params: {
            shopId: this.routerParams.shopId
          }
        })
        .then(res => {
          this.paramsIs.push({
            list: [],
            title: "销售员工",
            emit: "saleDealUserId"
          });
          for (let item of res.data.result) {
            this.paramsIs[0].list.push({
              name: item.userName,
              id: item.userId
            });
          }
        });
    },
    getData() {
      window.axios
        .get(baseUrl + "/controller/getCarById", {
          params: {
            carId: this.$route.query.carId,
            imageViewId: 2
          }
        })
        .then(res => {
          this.routerParams = res.data.result;
          this.turbineNum = parseFloat(
            this.routerParams.carDisplacement
          ).toFixed(1);
          this.carVin = this.routerParams.carVin;
          this.carFinanceService = this.routerParams.carFinanceService;
          this.carExtendedWarranty = this.routerParams.carExtendedWarranty;
          if (!this.routerParams.carRetailPrice) {
            this.negoIs = true;
          } else {
            this.negoIs = false;
          }
          this.paramsImgPush();
          if (this.routerParams.carDisplacement.indexOf("L") == -1) {
            this.turbineIs = true;
          }
        });
    },
    paramsImgPush() {
      bus.$carImgChange = [];
      for (let i of this.routerParams.carImages) {
        bus.$carImgChange.push({
          imgKey: i.imageKey,
          imgUrl: i.imageUrl,
          imgId: i.imageId
        });
      }
      this.$nextTick().then(() => {
        this.$watch("carVin", function() {
          this.carVin = this.carVin.toUpperCase();
        });
      });
    },
    //			//车场区域
    busOn() {
      bus.$off("regionName");
      bus.$off("shopName");
      bus.$off("carKeyNum");
      bus.$off("carOutColor");
      bus.$off("carInColor");
      bus.$off("carTypeName");
      bus.$off("carLicenceStatus");
      bus.$on("regionName", index => {
        this.routerParams.regionId = this.paramsIs[0].list[index].id;
        this.routerParams.region.regionName = this.paramsIs[0].list[index].name;
        this.paramsIs = [];
      });
      bus.$on("shopName", index => {
        this.routerParams.shopId = this.paramsIs[0].list[index].id;
        this.routerParams.shop.shopName = this.paramsIs[0].list[index].name;
        this.routerParams.user.userName = "";
        this.routerParams.saleUserId = "";
        this.paramsIs = [];
      });

      bus.$on("carKeyNum", index => {
        this.routerParams.carKeyNum = this.paramsIs[0].list[index].id;
        this.paramsIs = [];
      });

      bus.$on("carOutColor", index => {
        this.routerParams.carOutColor = this.paramsIs[0].list[index].name;
        this.paramsIs = [];
      });

      bus.$on("carInColor", index => {
        this.routerParams.carInColor = this.paramsIs[0].list[index].name;
        this.paramsIs = [];
      });

      bus.$on("carTypeName", index => {
        this.routerParams.carTypeId = this.paramsIs[0].list[index].id;
        this.routerParams.carType.carTypeName = this.paramsIs[0].list[
          index
        ].name;
        this.paramsIs = [];
      });

      bus.$on("carLicenceStatus", index => {
        this.routerParams.carLicenceState = this.paramsIs[0].list[index].id;
        this.paramsIs = [];
      });
      bus.$off('carPurposeName')
				bus.$on('carPurposeName', index => {
					this.routerParams.carPurpose = this.paramsIs[0].list[index].id
					this.paramsIs = []
				})
    },
    carPurposeFn () {
				this.paramsIs.push({
					list: [{name: '营运', id:1},{name: '非营运', id:2},{name: '营转非', id:3}],
					title: '使用性质',
					emit: 'carPurposeName',
				})
			},
    regionNameFn() {
      window.axios
        .get(baseUrl + "/controller/getRegionList", {
          params: {
            marketId: this.routerParams.marketId
          }
        })
        .then(res => {
          this.paramsIs.push({
            list: [],
            title: "车场区域",
            emit: "regionName"
          });
          for (let item of res.data.result) {
            this.paramsIs[0].list.push({
              name: item.regionName,
              id: item.regionId
            });
          }
        });
    },
    //商铺列表
    shopNameFn() {
      window.axios
        .get(baseUrl + "/controller/getShopList", {
          params: {
            marketId: this.routerParams.marketId,
            shopState: 1
          }
        })
        .then(res => {
          this.paramsIs.push({
            list: [],
            title: "商铺列表",
            emit: "shopName"
          });
          for (let item of res.data.result) {
            this.paramsIs[0].list.push({
              name: item.shopName,
              id: item.shopId
            });
          }
        });
    },
    // 品牌车系
    brandNameFn() {
      this.brandModal.show();
      //				this.paramsBrand = true
    },
    carKeyNumFn() {
      this.paramsIs.push({
        list: [
          {
            id: 1,
            name: 1
          },
          {
            id: 2,
            name: 2
          },
          {
            id: 3,
            name: 3
          },
          {
            id: 4,
            name: 4
          },
          {
            id: 5,
            name: 5
          }
        ],
        title: "钥匙数量",
        emit: "carKeyNum"
      });
    },
    brandDelete() {
      this.paramsBrand = false;
    },
    brandComplete(value) {
      this.paramsBrand = false;
      this.routerParams.brandId = value.brand.id;
      this.routerParams.brand.brandName = value.brand.name;
      this.routerParams.modelId = value.model.id;
      this.routerParams.model.modelName = value.model.name;
      this.routerParams.seriesId = value.series.id;
      this.routerParams.series.seriesName = value.series.name;
      this.routerParams.carTitle =
        value.brand.name + " " + value.series.name + " " + value.model.name;
    },
    //外观颜色
    carOutColorFn() {
      window.axios.get(baseUrl + "/controller/getColorList").then(res => {
        this.paramsIs.push({
          list: [],
          title: "外观颜色",
          emit: "carOutColor"
        });
        //					console.log(res)
        for (let item of res.data.result) {
          this.paramsIs[0].list.push({
            name: item.colorName,
            id: item.colorId
          });
        }
      });
    },
    //内饰颜色
    carInColorFn() {
      window.axios.get(baseUrl + "/controller/getColorList").then(res => {
        this.paramsIs.push({
          list: [],
          title: "内饰颜色",
          emit: "carInColor"
        });
        //					console.log(res)
        for (let item of res.data.result) {
          this.paramsIs[0].list.push({
            name: item.colorName,
            id: item.colorId
          });
        }
      });
    },
    //车身类型
    carTypeNameFn() {
      window.axios.get(baseUrl + "/controller/getCarTypeList").then(res => {
        this.paramsIs.push({
          list: [],
          title: "车身类型",
          emit: "carTypeName"
        });
        //					console.log(res)
        for (let item of res.data.result) {
          this.paramsIs[0].list.push({
            name: item.carTypeName,
            id: item.carTypeId
          });
        }
      });
    },

    //是否上牌
    carLicenceStatusFn() {
      this.paramsIs.push({
        list: [
          {
            name: "已上牌",
            id: 1
          },
          {
            name: "未上牌",
            id: 2
          },
          {
            name: "新车",
            id: 3
          }
        ],
        title: "是否上牌",
        emit: "carLicenceStatus"
      });
    },

    submit() {
      //				console.log(this.$route.query.params)
    },
    nextStep(event) {
      if (!this.routerParams.shopId) {
        $toast.show("请选择商铺", 2000);
        return;
      }
      if (!this.routerParams.modelId) {
        $toast.show("请选择品牌、车型、车系", 2000);
        return;
      }
      if (this.$refs.carLicenceDate) {
        let carLicenceDate = new Date(
          Date.parse(this.$refs.carLicenceDate.value)
        );
        let presentTime = new Date();
        if (
          carLicenceDate.getFullYear() > presentTime.getFullYear() ||
          (carLicenceDate.getFullYear() == presentTime.getFullYear() &&
            carLicenceDate.getMonth() > presentTime.getMonth())
        ) {
          $toast.show("首次上牌年月大于本月", 2000);
          return;
        }
      }

      $dialog
        .confirm({
          // 标题
          title: "提示",
          content: "是否提交修改",
          // 取消按钮文本
          cancelText: "取消",
          // 确定按钮文本
          okText: "提交"
        })
        .then(res => {
          if (res) {
            this.$nextTick().then(() => {
              var formData = new FormData(event.target);
              window.axios
                .post(baseUrl + "/controller/car/updateCar", formData)
                .then(data => {
                  if (data) {
                    setTimeout(() => {
                      $toast.show("修改成功", 2000);
                      setTimeout(() => {
                        sess.set("carId", this.routerParams.carId);
                        sess.set("modelId", this.routerParams.modelId);
                        $router.push({
                          path: "/vehicle_step2",
                          query: {
                            carId: this.routerParams.carId
                          }
                        });
                      }, 500);
                    }, 400);
                  }
                });
            });
          }
        });
    },
    modelChange() {
      this.backfill.modelConf.map(item => {
        item.childCarConf.map(itemto => {
          if (itemto.selectedState) {
            this.carConfIds.push(itemto.confId);
          }
        });
      });
    },
    backfillFn(obj) {
      this.routerParams.brand.brandName = obj.brand.brandName;
      this.routerParams.brandId = obj.brand.brandId;
      this.routerParams.series.seriesName = obj.series.seriesName;
      this.routerParams.seriesId = obj.series.seriesId;
      this.routerParams.model.modelName = obj.modelName;
      this.routerParams.modelId = obj.modelId;
      this.routerParams.carTitle = `${obj.brand.brandName} ${
        obj.series.seriesName
      } ${obj.modelName}`;
      this.turbineNum = obj.modelDisplacement;
      this.turbineIs = obj.modelInletModel == "T" ? true : false;
      this.routerParams.carGearbox = obj.modelGearboxModality;
      this.modelChange();
    },
    fileClick() {
      let options = {
        effect: "scale",
        title: "",
        buttons: [{ text: "VIN码拍照" }, { text: "行驶证拍照" }],
        showClose: true
      };
      let popup = $popup.fromTemplate(
        '<p style="margin-bottom: 0; text-align: center;">请选择拍照方式</p>',
        options
      );
      popup.show().then(buttonIndex => {
        if (buttonIndex === 1) {
          this.getInterface = "driverlicenseocr";
        } else if (buttonIndex === 0) {
          this.getInterface = "generalocr";
        } else {
          return;
        }
        let u = navigator.userAgent,
          app = navigator.appVersion;
        if (u.indexOf("Android") > -1 || u.indexOf("Linux") > -1) {
          this.$refs["fileImg"].click();
        } else {
          this.$refs["fileImg"].click();
          this.$refs["fileImg"].click();
        }
      });
    },
    fileFn() {
      var _this = this;
      var reader = new FileReader();
      reader.readAsDataURL(this.$refs.fileImg.files[0]);
      reader.onloadend = function() {
        _this.value = reader.result;
        _this.filePost(reader.result.match(/,(\S*)/)[1]);
      };
    },
    filePost(Url) {
      let instance = axios.create({
        headers: {
          Authorization:
            "DP92m1bWVrMOm/xAZjfZQqQIhpxhPTEwMTI1NDE4Jms9QUtJRHBZQm1EVGY4YTlkdzQwNHJmSnJzbVdDNE5XVU1iOW9JJmU9MTUyODk1NTg2NCZ0PTE1MjYzNjM4NjMmcj0zODE5NDY0MDUxJnU9NjIzNjMwMzAy",
          "content-type": "text/json"
        }
      });
      $loading.show("拼命加载中..");
      if (this.getInterface == "generalocr") {
        instance({
          method: "post",
          url: "https://api.youtu.qq.com/youtu/ocrapi/" + this.getInterface,
          data: {
            app_id: "10125418",
            image: Url
          }
        })
          .then(res => {
            $loading.hide();
            this.$refs.fileImg.value = "";
            if (res) {
              res.data.items.map(item => {
                if (item.itemstring.replace(/\s+/g, "").length == 17) {
                  this.carVin = item.itemstring.replace(/\s+/g, "");
                }
              });
            }
          })
          .catch(err => {
            $loading.hide();
            this.$refs.fileImg.value = "";
            setTimeout(() => {
              $toast.show("服务器繁忙,请稍后再试", 2000);
            }, 400);
          });
      } else {
        instance({
          method: "post",
          url: "https://api.youtu.qq.com/youtu/ocrapi/" + this.getInterface,
          data: {
            type: 0,
            app_id: "10125418",
            image: Url
          }
        })
          .then(res => {
            $loading.hide();
            this.$refs.fileImg.value = "";
            if (res) {
              res.data.items.map(item => {
                if (item.itemstring.replace(/\s+/g, "").length == 17) {
                  this.carVin = item.itemstring.replace(/\s+/g, "");
                }
              });
            }
          })
          .catch(err => {
            $loading.hide();
            this.$refs.fileImg.value = "";
            setTimeout(() => {
              $toast.show("服务器繁忙,请稍后再试", 2000);
            }, 400);
          });
      }
    },
    getModelInfoByVin() {
      axios
        .get(baseUrl + "/controller/model/getModelInfoByVin", {
          params: {
            vin: this.carVin
          }
        })
        .then(res => {
          if (res.data.result.length == 1) {
            this.backfill = res.data.result[0];
            this.backfillFn(res.data.result[0]);
          } else if (res.data.result.length > 1) {
            this.getJson.paramsIs.push({
              list: [],
              title: "车型选择",
              emit: "modelChoice"
            });
            for (let item of res.data.result) {
              this.getJson.paramsIs[0].list.push({
                name: `${item.brand.brandName} ${item.series.seriesName} ${
                  item.modelName
                }`,
                id: item
              });
            }
          } else {
            setTimeout(() => {
              $toast.show("未找到该车型信息,请手动输入", 2000);
            }, 400);
          }
        });
    }
  },
  watch: {
    turbineIs: function() {
      if (this.turbineIs) {
        this.turbine = "T";
      } else {
        this.turbine = "L";
      }
    },
    "routerParams.carBusinessInsuranceDate"() {
      this.carBusinessInsuranceDateTrue = this.routerParams
        .carBusinessInsuranceDate
        ? false
        : true;
    }
  }
};
</script>